import { Module } from 'vuex'
import settings from '@/settings'
import deepClone from '@/utils/deep-clone'

interface State {
  show: boolean //是否显示全局弹窗
  params: IParams //提示参数配置
}

export interface IParams {
  content: string //模态框内容
  title: string //标题内容
  width: number //模态框宽度
  showTitle: boolean //是否显示标题
  showTitleIcon: boolean //是否显示标题图标
  titleIcon: string //标题图标图标
  titleIconSize: number //标题鼠标大小
  titleIconColor: string //标题图标颜色
  showConfirmButton: boolean //是否显示确认按钮
  showCloseIcon: boolean //是否显示关闭按钮
  showCancelButton: boolean //是否显示取消按钮
  confirmText: string //确认按钮的文字
  cancelText: string //取消按钮的文字
  cancelColor: string //取消按钮的颜色
  confirmColor: string //确认按钮的颜色
  borderRadius: number //模态框圆角值
  asyncClose: boolean //是否异步关闭
  maskCloseAble: boolean //是否允许点击遮罩关闭
  negativeTop: number //往上偏移的值，以避免可能弹出的键盘重合，单位任意，数值则默认为rpx单位
  model: string //样式类型目前包括default style1
  slot: boolean //是否插入内容
  confirm: () => void //点击确定事件
  cancel: () => void //点击取消事件
}

export const params = {
  content: '',
  title: '提示',
  width: 600,
  showTitle: false,
  showTitleIcon: false,
  titleIcon: 'checked',
  titleIconSize: 40,
  titleIconColor: '#04B854',
  showConfirmButton: true,
  showCancelButton: false,
  showCloseIcon: false,
  confirmText: '确认',
  cancelText: '取消',
  cancelColor: settings.css['--font-regular-c'],
  confirmColor: settings.css['--primary-c'],
  borderRadius: 16,
  asyncClose: false,
  maskCloseAble: false,
  negativeTop: 0,
  model: 'style1',
  slot: false,
  confirm: () => ({}),
  cancel: () => ({}),
}

const store: Module<State, unknown> = {
  namespaced: true,
  state() {
    return {
      show: false,
      params: deepClone(params),
    }
  },

  // 只能同步
  mutations: {
    setModalParams(state, value) {
      state.params = { ...deepClone(params), ...value }
    },
    setModalShow(state, value) {
      state.show = value
    },
  },
  // 支持异步,可以考虑引入API
  actions: {},
}

export default store
